<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>电影数据表格</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <h1 class="header">电影数据表格</h1>
    
    <div class="filter-container">
        <input type="text" id="searchInput" class="filter-input" placeholder="搜索电影名称...">
        <button onclick="filterTable()" class="filter-button">搜索</button>
        <button onclick="sortByRating()" class="filter-button" style="margin-left: 10px;">按评分排序</button>
    </div>

    <table id="movieTable">
        <thead>
            <tr>
                <th>标识</th>
                <th>评分</th>
                <th>评价人数</th>
                <th>链接</th>
                <th>详细信息</th>
            </tr>
        </thead>
        <tbody>
            <!-- 数据将通过JavaScript动态填充 -->
        </tbody>
    </table>

    <script src="script.js"></script>
</body>
</html>